﻿@charset "utf-8";
/* 
    author:PengJin;
    date:2019-11-06;
*/

/* --sites-- */
.sites{padding:70px 0;overflow:hidden;}
.sites .wrap-title h2 em:after{position:relative;top:-15px;content:"+";font-size:24px;}
.area-box{position:relative;margin:120px auto 0;width:1230px;height:520px;background:url(global_bg.png) no-repeat;transition:all 0.5s;}
.area-box .bee{display:block;/*position:absolute;left:935px;top:80px;*/width:108px;height:30px;background:url(bee.png);}
.area-list li{position:absolute;z-index:3;font-size:18px;color:#ccc;width:100px;height:100px;line-height:100px;text-align:center;cursor:pointer;}
.area-list li.li1{left:450px;top:310px;}
.area-list li.li2{left:620px;top:270px;}
.area-list li.li3{left:820px;top:240px;}
.area-list li.li4{left:1150px;top:230px;}
.area-list li.li5{left:960px;top:150px;}
.area-list li.li6{left:840px;top:50px;}
.area-list li.li7{left:360px;top:140px;}
.area-list li.li8{left:240px;top:55px;}
.area-list li.li9{left:150px;top:200px;}
.area-list li.li10{left:300px;top:270px;}
.area-list li.cur{color:#fff;}
.bubble-list li{position:absolute;z-index:1;width:58px;/*animation:fadeinB 3s ease-in-out;*/}
.bubble-list li .circles{
    position:relative;display:block;width:58px;height:58px;line-height:58px;text-align:center;color:#fff;border-radius:50%;background:#2449a4;cursor:pointer;
}
.bubble-list li .circles span{display:block;font-size:12px;}
.bubble-list li .circles em{display:block;font-size:24px;}
.bubble-list li:before{display:block;position:absolute;left:50%;bottom:0;content:"";width:1px;height:100%;background:url(area_line.png) repeat-y;}
.bubble-list li:after{display:block;position:absolute;left:50%;bottom:0;content:"";margin-left:-2px;width:5px;height:5px;background:#2449a4;border-radius:50%;}
.bubble-list li.cur .circles{background:#ff6900;}
.bubble-list li.cur .circles:after{position:absolute;left:0;top:0;width:100%;height:100%;content:"";background:rgba(255,105,0,0.1);border-radius:50%;animation:scales infinite 3s ease-out;}
.bubble-list li.cur:before{background:url(area_line_on.png) repeat-y;}
.bubble-list li.cur:after{background:#ff6900;}
.bubble-list li.li1{left: 939px;top: 130px;height:125px; width:108px;}
.bubble-list li.li2{left:555px;top:-36px;height:165px;}
.bubble-list li.li3{left:493px;top:-80px;height:200px;}
.bubble-list li.li4{left:504px;top:15px;height:165px;}
.bubble-list li.li5{left:561px;top:60px;height:105px;}
.bubble-list li.li6{left:609px;top:302px;height:200px;}
.bubble-list li.li7{left:217px;top:150px;height:200px;}
.bubble-list li.li8{left:194px;top:-95px;height:200px;}
.bubble-list li.li9{left:139px;top:-20px;height:210px;}
.bubble-list li.li10{left:109px;top:65px;height:200px;}
.bubble-list li.li11{left:319px;top:220px;height:200px;}
.bubble-list li.li12{left:264px;top:328px;height:200px;}
.bubble-list li.li13{left:829px;top:-28px;height:125px;}
.bubble-list li.li14{left:829px;top:158px;height:100px;}
.bubble-list li.li15{left:899px;top:174px;height:90px;}
.bubble-list li.li16{left:1005px;top:-8px;height:205px;}
.bubble-list li.li17{left:1047px;top:60px;height:136px;}
.bubble-list li.li18{left:1047px;top:340px;height:136px;}
.area-box .more{position:absolute;left:50%;bottom:2px;margin-left:-106px;width:212px;height:50px;}
.area-box .more a{display:block;width:212px;height:50px;line-height:50px;font-size:15px;color:#333;text-indent:45px;background:url(area_more.png) no-repeat;}
.area-box .more a:hover{color:#811d21;background:url(area_btn_more.png) no-repeat;}

/**********  总部图标  **********/
.bubble-list li.li1:before{display:block;position:absolute;left:50%;bottom:0;content:"";width:1px;height:78%;background:url(area_line.png) repeat-y;}
.bubble-list li.li1.cur:before{background:url(area_line_on.png) repeat-y;}
/*.bubble-list li.li1.cur:after{background:#2449a4;}*/
.bubble-list li.li1 .circles{
    position:relative;display:block;width:108px;height:30px;border-radius:15px;background:none;
    border:none;
}
/*.bubble-list li:after{display:block;position:absolute;left:50%;bottom:0;content:"";margin-left:-2px;width:5px;height:5px;background:#2449a4;border-radius:50%;}*/
.bubble-list li.li1.cur .circles{background:#e9f0ff;border:none;}
.bubble-list li.li1.cur .circles:after{position:absolute;left:0;top:0;width:100%;height:100%;content:"";background:rgba(36,73,164,0.1);border-radius:50%;animation:scales infinite 3s ease-out;}

@keyframes scales{
    0%{transform:scale(0)}
    70%{transform:scale(1.5)}
    100%{transform:scale(0)}
}
/* --end sites-- */